<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
	
		<title>木木之家</title>
		<link rel="stylesheet" type="text/css" href="./css/自定义栅格.css" />
		<link rel="stylesheet" type="text/css" href="./css/index.css" />
		<link rel="stylesheet" type="text/css" href="./css/public.css" />
		<link rel="stylesheet" type="text/css" href="./css/iconfont.css">
		<script src="./js/index.js" type="text/javascript" charset="utf-8"></script>
		<link rel="shortcut icon" href="./img/qinlin.jpg">

	</head>

	<body>
		<div id="snowFlow"></div>
		<div id="myHome">

			<!--头部开始-->
			<div id="header" class="clearfix">
				<div class="header_fix">
					<div class="container">
						<div class="row clearfix" >
							<a href="index.html"  class="col-xs-6 logo"><i></i></a>
						<ul>
							<a href="index.html" class="col-xs-6 ">
								<li>
									<i class="iconfont icon-mu"></i>
									<span>首页</span>
								</li>
							</a>
							<a href="aboutMe.html" class="col-xs-6 ">
								<li class="aboutMe">
									<i class="iconfont icon-wo"></i>
									<span>关于我</span>
								</li>
							</a>
							<a href="music.html" class="col-xs-6 ">
								<li>
									<i class="iconfont icon-yinle"></i> 音乐
								</li>
							</a>
							<a href="photos.html" class="col-xs-6 ">
								<li>
									<i class="iconfont icon-zhaopian"></i>
									<span>相册</span>
								</li>
							</a>
							<a href="diary.html" class="col-xs-6 ">
								<li>
									<i class="iconfont icon-diary"></i>
									<span>日记</span>
								</li>
							</a>
							<a href="travel.html" class="col-xs-6 ">
								<li>
									<i class="iconfont icon-lvhang1"></i> 旅行
								</li>
							</a>

							<a href="contactME.html" class="col-xs-6 ">
								<li>
									<i class="iconfont icon-dianhua"></i>
									<span>联系我</span>
								</li>
							</a>
							<a href="webProduct.html" class="col-xs-6 ">
								<li>
									<i class="iconfont icon-xiangmu"></i>
									<span>web作品展示</span>
								</li>
							</a>
						</ul>
						</div>
						
					</div>
				</div>

			</div>
			<!--头部结束-->

			<div id="Flash">
				<!--轮播图部分-->
				<div class="container">
					<div class="F_left">
						<div class="photo">
							<img src="./img/11.jpg"/>
						</div>
							<ul class="introduce">
								<li>
									<i class="iconfont icon-wo"></i>
									<span>张琴琳</span>
								</li>
								<li>
									<i class="iconfont icon-mu1"></i>
									<span>1992/07</span>
								</li>
								<li >
									<i class="iconfont icon-didian"></i>
									<span>湖南省长沙市</span>
								</li>
								<li>
									<i class="iconfont icon-dianhua1"></i>
									<span>电话：17377876272</span>
								</li>
								<li>
									<i class="iconfont icon-qq"></i>
									<span>163942170</span>
								</li>
								<li>
									<i class="iconfont icon-xiangce"></i>
									<span>1639421708@qq.com</span>
								</li>
								<li>
									<i class="iconfont icon-xiangce"></i>
									<span>qinlin992</span>
								</li>
							</ul>
					</div>
					<div class="Flash_list">
						<a href="#"><img src="./img/5.jpg" / class="lbt"></a>
						<div class="flash_cover">
							<div class="welcome">
								<div class="introduce">
									<span style="font-size: 30px;">欢迎来到张琴琳的个人主页</span>
									<div><em>My name is Zhangqinlin,I come from xiangxi hunan province,and  I graduated from Beijing Wuzi University...</em> </div>
								</div>
								<a href="aboutMe.html" class="more">了解我更多>></a>
							
							</div>
					    </div>
						<div class="turn_left turn"></div>
						<div class="turn_right turn"></div>
					</div>
				
				</div>
				<!--轮播图结束-->
			</div>

			<!--内容概览部分-->
			<div class="desc">
				<div class="container clearfix">
					<!--日记-消逝在时光里的记忆-->
					<div class="diary clearfix">
						<div class="title ">
							<i class="iconfont icon-meinv"></i>
							<span>那些消逝在时光里的记忆</span>
						</div>
						<div class='row clearfix'>
							<div class="col-lg-3 col-md-6 col-xs-12 col-sm-6">
								<div class="desc-item clearfix">
									<h3>那些年</h3>
									<p>good good good good good good good good good good good good good good good good good good good good good good good good good good </p>
									<a href="#">阅读更多...</a>
								</div>
							</div>
							<div class="col-lg-3 col-md-6 col-xs-12 col-sm-6">
								<div class="desc-item">
									<h3>那些年</h3>
									<p>good good good good good good good good good good good good good good good good good good good good good good good good good good </p>
									<a href="#">阅读更多...</a>
								</div>
							</div>
							<div class="col-lg-3 col-md-6 col-xs-12 col-sm-6">
								<div class="desc-item">
									<h3>那些年</h3>
									<p>good good good good good good good good good good good good good good good good good good good good good good good good good good </p>
									<a href="#">阅读更多...</a>
								</div>
							</div>
							<div class="col-lg-3 col-md-6 col-xs-12 col-sm-6">
								<div class="desc-item">
								<h3>那些年</h3>
									<p>good good good good good good good good good good good good good good good good good good good good good good good good good good </p>
									<a href="#">阅读更多...</a>
								</div>
							</div>
						</div>
					</div>
					<!--日记-消逝在时光里的记忆结束-->

					<!--旅行相册-->
					<div class="diary clearfix">
						<div class="title ">
							<i class="iconfont icon-hua1" style="color: red;margin-left: 5px;"></i>
							<span>那些年走过的路</span>
						</div>
						<div class='row clearfix'>
							<div class="col-lg-3 col-md-6 col-xs-12 col-sm-6">
								<div class="desc-item clearfix">
									dddddd <br /> dddddd <br /> dddddd <br /> dddddd <br /> dddddd <br /> dddddd <br /> dddddd <br /> dddddd <br />
								</div>
							</div>
							<div class="col-lg-3 col-md-6 col-xs-12 col-sm-6">
								<div class="desc-item">
									dddddd <br /> dddddd <br /> dddddd <br /> dddddd <br /> dddddd <br /> dddddd <br /> dddddd <br /> dddddd <br />
								</div>
							</div>
							<div class="col-lg-3 col-md-6 col-xs-12 col-sm-6">
								<div class="desc-item">
									dddddd <br /> dddddd <br /> dddddd <br /> dddddd <br /> dddddd <br /> dddddd <br /> dddddd <br /> dddddd <br />
								</div>
							</div>
							<div class="col-lg-3 col-md-6 col-xs-12 col-sm-6">
								<div class="desc-item">
									dddddd <br /> dddddd <br /> dddddd <br /> dddddd <br /> dddddd <br /> dddddd <br /> dddddd <br /> dddddd <br />
								</div>
							</div>
						</div>
					</div>
					<!--旅行相册结束-->

					<!--web作品展示-->
					<div class="webProuct clearfix">
						<div class="title ">
							<i class="iconfont icon-zan"></i>
							<span>对web前端的热爱</span>
						</div>
						<div class='row clearfix'>
							<div class="col-lg-3 col-md-6 col-xs-12 col-sm-6">
								<div class="desc-item clearfix">
									<h3>小米商城</h3>
									<img src="./img/xiaomi.jpg"/>
									<a href="#">详细信息...</a>
								</div>
							</div>
							<div class="col-lg-3 col-md-6 col-xs-12 col-sm-6">
								<div class="desc-item">
									<h3>canvas h5</h3>
									<img src="./img/canvas.jpg"/>
									<a href="#">详细信息...</a>
								</div>
							</div>
							<div class="col-lg-3 col-md-6 col-xs-12 col-sm-6">
								<div class="desc-item">
									<h3>美图网</h3>
									<img src="./img/meituan.jpg"/>
									<a href="#">详细信息...</a>
								</div>
							</div>
							<div class="col-lg-3 col-md-6 col-xs-12 col-sm-6">
								<div class="desc-item">
									<h3>淘宝</h3>
									<img src="./img/taobao.jpg"/>
									<a href="#">详细信息...</a>
								</div>
							</div>
						</div>
					</div>
					<!--web作品展示结束-->
				</div>
			</div>

			<!--底部部分-->
			<div id="footer">
				<div class='container'>
					<div class='footer_link'>web前端学习常用链接：
						<a href="https://github.com/">github</a>
						<a href="https://ke.qq.com/">腾讯课堂</a>
						<a href="https://ke.qq.com/">腾讯课堂</a>
						<a href="https://ke.qq.com/">腾讯课堂</a>
						<a href="https://ke.qq.com/">腾讯课堂</a>
						<a href="https://ke.qq.com/">腾讯课堂</a>
						<a href="https://ke.qq.com/">腾讯课堂</a>
					</div>
					<p>本网站作者：张琴琳，所有的内容由本人原创，侵权必究。</p>
				</div>
			</div><br />
			<!--底部部分结束-->

			<!--回到顶部按钮-->
			<div class="toTOP">
				<div class="f_top">

				</div>
			</div>
			<!--回到顶部按钮结束-->
		</div>
		
	</body>

</html>